import 'package:english_words/english_words.dart';
import 'package:flutter/material.dart';
import 'package:queue_flutter/caller.dart';
import 'package:queue_flutter/enterQueue.dart';
import 'package:queue_flutter/queuer.dart';
import 'package:queue_flutter/settings.dart';
import 'package:shared_preferences/shared_preferences.dart';
import 'package:uuid/uuid.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        // This is the theme of your application.
        //
        // TRY THIS: Try running your application with "flutter run". You'll see
        // the application has a purple toolbar. Then, without quitting the app,
        // try changing the seedColor in the colorScheme below to Colors.green
        // and then invoke "hot reload" (save your changes or press the "hot
        // reload" button in a Flutter-supported IDE, or press "r" if you used
        // the command line to start the app).
        //
        // Notice that the counter didn't reset back to zero; the application
        // state is not lost during the reload. To reset the state, use hot
        // restart instead.
        //
        // This works for code too, not just values: Most code changes can be
        // tested with just a hot reload.
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      initialRoute: '/',
      routes: {
        '/': (context) => const MyHomePage(title: 'Queue'),
        '/enter': (context) => const EnterQueuePage(),
        '/caller': (context) => const CallerPage(),
        '/queuer': (context) => const QueuerPage(),
        '/settings': (context) => const SettingsPage(),
      },
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  String _userId = "";
  String _name = "";

  Future<void> _getOrInit() async {
    final prefs = await SharedPreferences.getInstance();
    var userId = prefs.getString("userId");
    var uuid = Uuid();
    if (userId == null) {
      userId = uuid.v4();
      await prefs.setString("userId", userId.toString());
    }

    var name = prefs.getString("name");
    if (name == null) {
      name = WordPair.random().asPascalCase;
      await prefs.setString("name", name);
    }
    setState(() {
      _userId = prefs.getString("userId") ?? "";
      _name = prefs.getString("name") ?? "";
    });
  }

  @override
  void initState() {
    super.initState();
    _getOrInit();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
        actions: [
          IconButton(
              onPressed: () => {Navigator.pushNamed(context, '/settings')},
              icon: const Icon(
                Icons.settings,
                semanticLabel: 'settings',
              ))
        ],
      ),
      body: Center(
        child: Column(
          // mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Padding(
              padding: const EdgeInsets.all(8.0),
              child: const Text(
                'I am a ...',
                style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold),
              ),
            ),
            Expanded(
              child: Padding(
                padding: const EdgeInsets.all(8.0),
                child: SizedBox(
                  width: double.infinity,
                  height: 200,
                  child: ElevatedButton(
                    style: ElevatedButton.styleFrom(
                        shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(16))),
                    onPressed: () => {Navigator.pushNamed(context, '/caller')},
                    child: const Text(
                      'Caller',
                      style: TextStyle(
                        fontSize: 36,
                        fontWeight: FontWeight.bold,
                      ),
                    ),
                  ),
                ),
              ),
            ),
            Expanded(
              child: Padding(
                padding: const EdgeInsets.all(8.0),
                child: SizedBox(
                  width: double.infinity,
                  height: 200,
                  child: ElevatedButton(
                      style: ElevatedButton.styleFrom(
                          shape: RoundedRectangleBorder(
                              borderRadius: BorderRadius.circular(16))),
                      onPressed: () => {Navigator.pushNamed(context, '/enter')},
                      child: const Text(
                        'Queuer',
                        style: TextStyle(
                          fontSize: 36,
                          fontWeight: FontWeight.bold,
                        ),
                      )),
                ),
              ),
            ),
            Row(
              mainAxisSize: MainAxisSize.min,
              children: [
                Text(
                  'Made with ',
                  style: TextStyle(color: Colors.black.withOpacity(0.5)),
                ),
                Icon(
                  Icons.favorite,
                  color: Colors.black.withOpacity(0.5),
                ),
                Text(
                  ' by Haonan Xiong',
                  style: TextStyle(color: Colors.black.withOpacity(0.5)),
                ),
              ],
            )
          ],
        ),
      ),
    );
  }
}
